<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>购物车 -E宠国际 - 国际站</title>
    <link rel="stylesheet" href="css/Echongz.css">
    <link rel="stylesheet" href="css/Echong.css">
    <link rel="stylesheet" href="css/EcZC.css">
    <link rel="stylesheet" href="css/Echong - gwc.css">
    <link rel="stylesheet" type="text/css" href="css/jquery.idcode.css">
    <script src="./lib/jquery-1.12.3.min.js"></script>
    <script src="./lib/jquery.idcode.js"></script>
    <script src="./lib/jquery-validation/jquery.validate.js"></script>
    <script src="./lib/layer-v3.1.1/layer.js"></script>
    <!-- <script src="./js/Echong.js"></script>
    <script src="./js/lunbo.js"></script> -->

</head>

<body>

    <div class="headerTop">
        <div class="w-max ct">
            <div class="header_t1">
                <p><a href="Echong.html" class="epethkbrand">E宠首页</a></p>
                <div>送至:</div>
                <div>
                    <div class="place-show c666 rel">
                        <div>重庆</div><b class></b>
                    </div>
                    <!--隐藏部分--->
                    <div></div>
                </div>
            </div>
            <ul class="header_topri">
                <li><a class="cred" href="">问题反馈</a></li>
                <li class="mobileApp"><i></i><a href="">手机版</a></li>
                <li>
                    <p class="topgz"><span>收藏我</span><b></b></p>
                </li>
                <li><i></i>
                    <p class="topgz fl"><span><a href="">我的E宠</a></span><b></b></p>
                </li>
                <li class="cart-t"><i></i><a href="">购物车(<em id="cart_num" data-name="cart_num">0</em>)</a></li>
                <li class="newxx ">
                    <i></i>
                    <p class="topgz fl newxx-tip" style="padding:0;"><span><a href="#" id="pms"
                                _userid="0a8871ba89a01239856be3c297c32334">新消息(<em>0</em>)</a></span></p>
                </li>
                <li><a href="Echong - dlu.html">[退出]</a></li>
                <li>小鱼</li>

            </ul>
        </div>
    </div>

    <div class="w-max ct" style="margin-top:50px;">
        <!-- 头部 -->
        <div class="cart-top" style="height: 60px;">
            <div class="cart-logo fl"><a href="#" title="E宠网">
                    <img src="./images/epethk_logo.png" alt="购物车"></a>
            </div>
            <div class="page-name c333 fl ml20">购物车</div>
            <form method="get" target="_blank" action="" id="schform">
                <div class="cart-search fr overflow clearfix mt20">
                    <ul class="sch_list hide"></ul>
                    <input type="text" name="keyword" class="search-text bgwhite fl" autocomplete="off">
                    <input name="pet_type" type="hidden" value="dog">
                    <input name="version" type="hidden" value="2.0.0">
                    <a href="javascript:void(0);" onclick="$('#schbutton').trigger('click');" class="cfff fr ftc">搜索</a>
                    <button class="shide" id="schbutton" value="true" type="submit"></button>
                </div>
            </form>

        </div>
        <!-- 头部 END -->
        <div class="select-menu rela">
            <div id="cart-menu">
                <ul class="cart-menu clearfix nav-menu">
                    <li id="one1" onclick="Epet.Cart.Submit.showCart();" class="current">
                        <span class="newtips2"></span>E宠国际购物车<em data-name="cart_num" class="fcolor ml5"></em>
                    </li>
                    <li id="one2" onclick="Epet.Cart.Submit.showFavors();">我的收藏<em class="fcolor ml5"></em></li>
                    <li id="one3" onclick="Epet.Cart.Submit.showBought();">我购买过<em class="fcolor ml5"></em></li>
                    <li id="one4" onclick="Epet.Cart.Submit.showViewed();">最近浏览<em class="fcolor ml5"></em></li>
                </ul>
                <div class="nav-currentt" style="width: 208px; left: 0px; overflow: hidden;">
                    <div class="arrow ftc"><i></i></div>
                </div>
            </div>
            <div class="cart-sentcity">
                <span class="fl ft14 db c999 mt">送货至：</span>
                <div class="rela cart-place-div fl" data-name="locationPlace">
                    <div class="rela place-div">
                        <div class="rela c666 mt5 place-show bgwhite pointer">
                            <div class="clearfix place-str">重庆 渝中区</div>
                            <b class=""></b>
                        </div>
                        <!--隐藏部分-->

                    </div>
                </div>
            </div>
            <div class="contentbox">
                <div id="con_one_1">

                    <!--购物车为空 BEGIN-->
                    <!-- <div class="ftc">
                        <div class="null-shopcart dib">
                            <h1 class="ft30 c999">您购物车空空的，快去选购吧！</h1>
                            <div class="mt5 go-bbtn">
                                <a class="sbtn mt" href="Echong.html"><span>去首页</span></a>
                            </div>
                        </div>
                    </div> -->
                    <table>
                        <thead cellpadding="0" cellspacing="0" class="cart-table mt" border="0" width="100%">
                            <tr>
                                <th>产品图片</th>
                                <th>产品名称</th>
                                <th>产品价格</th>
                                <th>产品数量</th>
                                <th>产品总金额</th>
                                <th>删除</th>
                            </tr>
                        </thead>
                        <tbody id="tab"><br>

                        </tbody>
                    </table>
                    <script>
                 $(function () {
                        $(function loadData() {
                            var uid = JSON.parse(localStorage.getItem("userInfo") || '{}').u_id;

                            $.ajax({
                                url: "./../../Echong/cartlistByUid.php",
                                data: { "u_id": uid },
                                type: 'post'
                            }).done(function (res) {
                                console.log(res);
                                var oTab = $("#tab");
                                // oTab.html("");
                                var strHtml='<tr>';
                                res.forEach((el, index) => {
                                    console.log(el)
                                    
                                    strHtml += `<td data-row=${JSON.stringify(el)}><img src=${el.c_pro_img}></td>`;
                                    strHtml += `<td>${el.c_pro_name}</td>`;
                                    strHtml += `<td>${el.c_pro_price}</td>`;
                                    strHtml += `<td><button class="jian">-</button> <input class='cls_num' value=${el.c_pro_num}><button class='jia'>+</button></td>`;
                                    strHtml += `<td>${el.c_pro_total}</td>`;
                                    strHtml += `<td> <a onclick=del(${el.c_id},this)>移除</a></td>`;
                                    strHtml+=`</tr>`;
                                });
                                

                                $(oTab).append(strHtml)

                            })



                        })
                    })
                    // loadData();
                    //加数量
                    $("table").on("click", ".jia", function () {
                        var num = $(this).prev().val();
                        $(this).prev().val(++num);

                        var data = $(this).parents("tr").find("td:eq(0)").data("row");
                        data.c_pro_num = $(this).prev().val();

                        $(this).parents("tr").find("td:eq(4)").text(data.c_pro_num * data.c_pro_price);


                        //解决,与后台接受的 名称不一致!
                        var saveObj = {};
                        saveObj.pro_id = data.c_pro_id
                        saveObj.pro_img = data.c_pro_img
                        saveObj.pro_name = data.c_pro_name
                        saveObj.pro_num = data.c_pro_num
                        saveObj.pro_price = data.c_pro_price
                        saveObj.pro_total = data.c_pro_total
                        saveObj.u_id = data.c_u_id

                        //把data通过ajax发送到后台同步就可以了
                        $.ajax({
                            url: "./../../Echong/cartsServer.php",
                            data: saveObj,
                            type: 'post'
                        }).then(function (res) {
                            console.log(res);

                            loadData();
                        })

                    })
                    //./../../Echong/cartsServer.php
                    //减数量
                    $("table").on("click", ".jian", function () {

                        var num = $(this).next().val();
                        if (num == 1) {
                            return;
                        }
                        $(this).next().val(--num);

                        var data = $(this).parents("tr").find("td:eq(0)").data("row");
                        data.c_pro_num = $(this).next().val();
                        $(this).parents("tr").find("td:eq(4)").text(data.c_pro_num * data.c_pro_price);
                        
                        //解决,与后台接受的 名称不一致!
                        var saveObj = {};
                        saveObj.pro_id = data.c_pro_id
                        saveObj.pro_img = data.c_pro_img
                        saveObj.pro_name = data.c_pro_name
                        saveObj.pro_num = data.c_pro_num
                        saveObj.pro_price = data.c_pro_price
                        saveObj.pro_total = data.c_pro_total
                        saveObj.u_id = data.c_u_id

                        //把data通过ajax发送到后台同步就可以了
                        $.ajax({
                            url: "./../../Echong/cartsServer.php",
                            data: saveObj,
                            type: 'post'
                        }).then(function (res) {
                            console.log(res);

                            loadData();
                        })

                    })






                    function del(num, obj) {
                        // console.log(obj);
                        $.ajax({
                            url: "./../../Echong/deleteByCart.php",
                            type: 'post',
                            data: { 'c_id': num },
                            dataType: 'json'
                        }).done(function (res) {

                            if (res.status == 1) {
                                alert("删除成功");
                                $(obj).parents("tr").remove();
                            } else { alert('删除失败') }
                        })
                    }

                    </script>



                    <!--购物车为空 END-->
                </div>
                <div id="con_one_2" style="display:none"></div>
                <div id="con_one_3" style="display:none"></div>
                <div id="con_one_4" style="display:none"></div>
            </div>

        </div>

        <a style="margin-bottom: 60px;display: block;" name="huangou"></a>
        <div class="redemptionCon">
            <div class="multi-menu">
                <div id="cart-hgmenu">
                    <ul class="cart-menu clearfix nav-menu" id="huangou">
                    </ul>
                    <div class="menu-currentt">
                        <div class="arrow ftc"><i></i></div>
                    </div>
                </div>
            </div>
            <div class="multi-content" style="margin-bottom: 30px;">
                <div id="qclist" class="hglist"></div>
                <div id="hg_111" class="hglist"></div>
            </div>
        </div>


    </div>

    <div class="footer-content" style="margin-top: 0px;">
        <div class="w-max ct footerbox">
            <div class="clearfix">
                <div class="footer-left fl">
                    <div class="clearfix f-hkcontace">
                        <div class="fl"><img src="./images/footer_logo.png"></div>
                        <div class="fl contact-epethk">
                            <div class="ft14 mt10">售后电话：<b class="ft20">400-888-9200</b> (免长途费)</div>
                            <div class="ft14 mt10 mt15">服务时间：周一到周日<span class="ml20">09:00-18:30</span> </div>
                        </div>
                    </div>
                    <div class="clearfix aboutus mt20">
                        <div class="fl ft14 aboutico1">关于E宠国际：<a href="#" class="ml15">正品保障</a><span
                                class="c999">|</span><a href="https://www.epetht.com/hkfaq.html#a_service">免税省钱</a><span
                                class="c999">|</span><a href="https://www.epetht.com/hkfaq.html#a_service">极速发货</a><span
                                class="c999">|</span><a href="https://www.epetht.com/hkfaq.html#a_service">国内售后</a>
                        </div>
                        <div class="fr ft14 aboutico2">常见问题答疑：<a href="#" class="ml15">支付与订单</a><span
                                class="c999">|</span><a href="https://www.epetht.com/hkfaq.html#a_answer">物流与售后</a><span
                                class="c999">|</span><a href="https://www.epetht.com/hkfaq.html#a_answer">关税与发票</a>
                        </div>
                    </div>
                </div>
                <div class="fr codebox ftc">
                    <div><img src="./images/footer-web.jpg"></div>
                    <div class="mt15 ft14">扫一扫，享品质养宠生活</div>
                </div>
            </div>

            <div class="mt15 c666 ft12">Copyright © 2017 epetht.com<a href="#" target="_blank" class="cright"><span
                        class="c666 ml5">渝ICP备17012853号-1</span></a><a href="https://www.epetht.com/article1.html"
                    target="_blank" class="cright"><span class="c666 ml5">营业执照</span></a> </div>
        </div>
    </div>
    <div id="rtbar" style="right: 0px; top: 0px; opacity: 1;">
        <div class="rtcont">
            <ul class="rtcont-up" data-name="rtbar" style="height: 472px; top: 30px;">
                <li class="rtl bagLi">
                    <div class="bagBox" style="display: none;">
                        <div class="you-nologin"> 您还没有登录，请先<a
                                href="https://passport.epet.com/login.html?referer=http://www.epetht.com"
                                style="text-decoration: underline;color: red;">登录</a>。</div>
                    </div>
                    <a class="rtico rt-my" href="http://my.epetht.com/"> </a>
                </li>

                <li class="scart rtl">
                    <div class="newdot"></div>
                    <label>购物车<em>◆</em></label>
                    <a class="rtico rt-cart" href="#">
                        <span class="rtico rt-cart"></span>
                        <div class="rt-cart-num">购物车<span>0</span></div>
                    </a>

                </li>
                <li class="sconsulted rtl consolutBox">
                    <label>在线客服<em>◆</em></label>
                    <a href="javascript:void(0);" onclick="openSDK()" class="rtico rt-consulted pointer online-newico">
                        <span class="rtico rt-consulted"></span>
                        <div class="rt-consulted-qus">在线客服</div>
                    </a>
                </li>

                <li class="rtl">
                    <label>我的订单<em>◆</em></label>
                    <a class="rtico rt-order" href="#"></a>
                </li>

                <li class="sview rtl">
                    <a class="rtico rt-view"></a>
                </li>
            </ul>
            <ul class="rtcont-dn" style="display: none;">

                <li class="rtl">

                </li>
                <li class="rtl">
                    <label>返回顶部<em>◆</em></label>
                    <a class="rtico rt-top" href="javascript:void(0);" style="visibility: visible;"></a></li>
            </ul>
        </div>
    </div>
</body>

</html>